import { useModel } from '@umijs/max';
import { Card, theme } from 'antd';
import { PageContainer } from '@ant-design/pro-components';
import React from 'react';

const Home: React.FC = () => {
  const { token } = theme.useToken();
  const { initialState } = useModel('@@initialState');
  
  return (
    <PageContainer>
      <Card
        style={{
          borderRadius: 8,
        }}
        styles={{
          body: {
            backgroundImage:
              initialState?.settings?.navTheme === 'realDark'
                ? 'background-image: linear-gradient(75deg, #1A1B1F 0%, #191C1F 100%)'
                : 'background-image: linear-gradient(75deg, #FBFDFF 0%, #F5F7FF 100%)',
          },
        }}
      >
        <div
          style={{
            textAlign: 'center',
            padding: '40px 0',
          }}
        >
          <div
            style={{
              fontSize: '24px',
              color: token.colorTextHeading,
              marginBottom: '20px',
            }}
          >
            欢迎使用系统首页
          </div>
          <p
            style={{
              fontSize: '14px',
              color: token.colorTextSecondary,
              lineHeight: '22px',
            }}
          >
            登录成功！这里是系统的主页面，您可以从左侧菜单访问各项功能。
          </p>
        </div>
      </Card>
    </PageContainer>
  );
};

export default Home;